<div data-extend-template="layouts/partials/table.html">
  <div data-block="search">
    <input type="text"
           class="form-control"
           placeholder="{{ 'Filter' | translate }}"
           ng-model="packageFilter"/>
  </div>

  <div data-block="filters">
    <div class="checkbox">
      <label>
        <input type="checkbox"
               ng-model="filter.original_packages"
               ng-change="updateFilter(filter)"/>

            <span ng-show="filter.inclusion" translate>
              Include all RPMs with no errata.
            </span>

            <span ng-show="!filter.inclusion" translate>
              Exclude all RPMs with no errata.
            </span>
      </label>
    </div>
  </div>

  <div data-block="list-actions">
    <button type="button" class="btn btn-default"
            ng-click="addRule()"
            ng-hide="denied('edit_content_views', contentView)">
      <span translate>Add Rule</span>
    </button>

    <button type="button" class="btn btn-default"
            ng-disabled="getSelectedRules(filter).length === 0"
            ng-hide="denied('edit_content_views', contentView)"
            ng-click="removeRules(filter)">
      <span translate>Remove Rule</span>
    </button>
  </div>

  <span data-block="no-rows-message" translate>
     Create a rule using the add button above.
  </span>

  <div data-block="table">
    <table class="table table-bordered table-striped">
      <thead>
        <tr bst-table-head row-select>
          <th translate>RPM Name</th>
          <th translate>Architecture</th>
          <th translate>Version</th>
          <th></th>
        </tr>
      </thead>

      <tbody>
        <tr bst-table-row ng-repeat="rule in table.rows | filter:packageFilter" row-select="rule">
          <td bst-table-cell>
            <div class="form-group">
              <input class="form-control"
                     ng-hide="denied('view_content_views', contentView)"
                     ng-model="rule.name"
                     uib-typeahead="name for name in fetchAutocompleteName($viewValue)"
                     ng-readonly="!rule.editMode"/>
            </div>
          </td>

          <td bst-table-cell>
            <div class="form-group">
              <input class="form-control"
                     ng-hide="denied('edit_content_views', contentView)"
                     ng-model="rule.architecture"
                     uib-typeahead="arch for arch in fetchAutocompleteArch($viewValue)"
                     ng-readonly="!rule.editMode"/>
            </div>
          </td>

          <td bst-table-cell>
            <span ng-hide="rule.editMode">
              <span ng-switch="rule.type">
                <span ng-switch-when="equal">
                  <span translate>Version {{ rule.version }}</span>
                </span>

                <span ng-switch-when="greater">
                  <span translate>Greater than version {{ rule.min_version }}</span>
                </span>

                <span ng-switch-when="less">
                  <span translate>Less than version {{ rule.max_version }}</span>
                </span>

                <span ng-switch-when="range">
                  <span translate>Between versions {{ rule.min_version }} and {{ rule.max_version }}</span>
                </span>

                <span ng-switch-default>
                  <span translate>All Versions</span>
                </span>
              </span>
            </span>

            <div ng-show="rule.editMode">
              <div class="form-group">
                <select class="form-control"
                        ng-model="rule.type"
                        ng-hide="denied('edit_content_views', contentView)"
                        ng-change="clearValues(rule)">
                  <option value="all" translate>All Versions</option>
                  <option value="equal" translate>Equal To</option>
                  <option value="greater" translate>Greater Than</option>
                  <option value="less" translate>Less Than</option>
                  <option value="range" translate>Range</option>
                </select>
              </div>

              <div class="row">
                <div ng-class="{ 'col-sm-12': rule.type != 'range', 'col-sm-5': rule.type === 'range'}"
                     ng-show="rule.type === 'greater' || rule.type === 'range'">

                  <div class="form-group">
                    <label for="minVersion" translate>Minimum Version</label>

                    <input id="minVersion" type="text"
                           class="form-control"
                           placeholder="{{ 'Minimum Version' | translate }}"
                           ng-model="rule.min_version"
                           ng-hide="denied('edit_content_views', contentView)"/>
                  </div>
                </div>

                <div ng-class="{ 'col-sm-12': rule.type != 'range', 'col-sm-5': rule.type === 'range'}"
                     ng-show="rule.type === 'less' || rule.type === 'range'">

                  <div class="form-group">
                    <label for="maxVersion" translate>Maximum Version</label>

                    <input id="maxVersion" type="text"
                           class="form-control"
                           placeholder="{{ 'Maximum Version' | translate }}"
                           ng-model="rule.max_version"
                           ng-hide="denied('edit_content_views', contentView)"/>
                  </div>
                </div>

                <div class="col-sm-12">
                  <div class="form-group" ng-show="rule.type === 'equal'">
                    <label for="version" translate>Version</label>

                    <input id="version" type="text" class="form-control"
                           placeholder="{{ 'Version' | translate }}"
                           ng-model="rule.version"
                           ng-hide="denied('edit_content_views', contentView)"/>
                  </div>
                </div>
              </div>
            </div>
          </td>

          <td bst-table-cell class="action-cell">
            <button type="button" class="btn btn-default" ng-click="rule.editMode = true; backupPrevious(rule)" ng-hide="rule.editMode">
              <span translate>Edit</span>
            </button>

            <button type="button" class="btn btn-default" ng-click="getMatchingContent(rule)" ng-hide="rule.editMode">
              <span translate>Show Matching Content</span>
            </button>

            <button bst-save-control
                    on-cancel="restorePrevious(rule); rule.editMode = false"
                    on-save="saveRule(rule)"
                    working="rule.working"
                    invalid="!valid(rule)"
                    ng-show="rule.editMode">
            </button>
          </td>
        </tr>
      </tbody>
    </table>
  </div>
</div>
